import axios from 'axios'
export default {
  namespaced: true,
  state: {
    // 这个变量就是购物车的数据，是一个数组，里面的元素是一个个对象，到时候发请求获取真实的购物车数据
    list: []
  },
  getters:{
    totalCount(state) {
      return state.list.reduce((prev, item)=>{
        prev += Number(item.count)
        return prev
      }, 0)
    },
    totalPrice(state) {
      return state.list.reduce((prev, item)=>{
        prev += Number(item.count) * Number(item.price)
        return prev
      }, 0)
    }
  },
  mutations: {
    // npm i axios
    // 下面是修改list数据
    updateListMutations(state, payload) {
      state.list = payload
    },
    updateCountMutations(state, payload) {
      console.log(state, payload);
      const item = state.list.find(item => item.id === payload.id)
      item.count = payload.count
    }
  },
  actions: {
    // 下面是异步代码获取数据，commit通知mutations去修改数据
    async getListActions(context) {
      const res = await axios('http://localhost:3000/cart')
      console.log(111, res);
      context.commit('updateListMutations', res.data)
    },
    async updateCountActions(context, payload) {
      console.log(context, payload);
      // 下面是更新服务器的数据
      await axios.patch(`http://localhost:3000/cart/${payload.id}`, {
        count: payload.count
      })
      // 更新本地的数据，将页面的数量更新
      context.commit('updateCountMutations', payload)
    }
  }
}
